- auto_ssl_available = ::Gitlab::LetsEncrypt.enabled?
- auto_ssl_enabled = domain_presenter.auto_ssl_enabled?
- auto_ssl_available_and_enabled = auto_ssl_available && auto_ssl_enabled
- has_user_defined_certificate = domain_presenter.certificate && domain_presenter.certificate_user_provided?

- if auto_ssl_available
  .form-group
    .row
      .gl-col-12.js-auto-ssl-toggle-container
        %label{ for: "pages_domain_auto_ssl_enabled_button" }
          - lets_encrypt_link_url = "https://letsencrypt.org/"
          - lets_encrypt_link_start = "<a href=\"%{lets_encrypt_link_url}\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"gl-whitespace-nowrap\">".html_safe % { lets_encrypt_link_url: lets_encrypt_link_url }
          - lets_encrypt_link_end = "</a>".html_safe
          = _("Automatic certificate management using %{lets_encrypt_link_start}Let's Encrypt%{lets_encrypt_link_end}").html_safe % { lets_encrypt_link_start: lets_encrypt_link_start, lets_encrypt_link_end: lets_encrypt_link_end }
          = render Pajamas::ToggleComponent.new(id: 'pages_domain_auto_ssl_enabled_button',
            classes: 'js-project-feature-toggle js-enable-ssl-gl-toggle gl-mt-3',
            is_checked: auto_ssl_available_and_enabled,
            label: _("Automatic certificate management using Let's Encrypt"),
            label_position: :hidden)
          = f.hidden_field :auto_ssl_enabled?, class: "js-project-feature-toggle-input"
        %p.gl-text-subtle.gl-mt-1
          - docs_link_url = help_page_path("user/project/pages/custom_domains_ssl_tls_certification/lets_encrypt_integration.md")
          - docs_link_start = "<a href=\"%{docs_link_url}\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"gl-whitespace-nowrap\">".html_safe % { docs_link_url: docs_link_url }
          - docs_link_end = "</a>".html_safe
          = _("Let's Encrypt is a free, automated, and open certificate authority (CA) that gives digital certificates in order to enable HTTPS (SSL/TLS) for websites. Learn more about Let's Encrypt configuration by following the %{docs_link_start}documentation on GitLab Pages%{docs_link_end}.").html_safe % { docs_link_url: docs_link_url, docs_link_start: docs_link_start, docs_link_end: docs_link_end }

.form-group.js-shown-unless-auto-ssl{ class: ("!gl-hidden" if auto_ssl_available_and_enabled) }
  - if has_user_defined_certificate & domain_presenter.persisted?
    .row.gl-mt-5
      .gl-col-12
        = render ::Layouts::CrudComponent.new(_('Certificate'),
          icon: 'partner-verified',
          count: '1') do |c|
          - c.with_body do
            .gl-flex.gl-items-baseline.gl-justify-between
              %span
                = domain_presenter.pages_domain.subject || _('missing')
              = render Pajamas::ButtonComponent.new(href: clean_certificate_project_pages_domain_path(@project, domain_presenter),
                icon: 'remove',
                category: :tertiary,
                button_options: { title: s_('GitLabPages|Remove certificate'), "aria-label": s_('GitLabPages|Remove certificate'), data: { method: :delete, confirm: _('Are you sure?'), 'confirm-btn-variant': 'danger', toggle: 'tooltip', container: 'body', testid: 'remove-certificate' } })
  - else
    .row.gl-mt-5
      .gl-col-12
        = f.label :user_provided_certificate, _("Certificate (PEM)")
        = f.text_area :user_provided_certificate,
          rows: 5,
          class: "form-control js-enabled-unless-auto-ssl",
          disabled: auto_ssl_available_and_enabled
        %span.help-inline.gl-text-subtle= _("Upload a certificate for your domain with all intermediates")
    .row
      .gl-col-12
        = f.label :user_provided_key, _("Key (PEM)")
        = f.text_area :user_provided_key,
          rows: 5,
          class: "form-control js-enabled-unless-auto-ssl",
          disabled: auto_ssl_available_and_enabled
        %span.help-inline.gl-text-subtle= _("Upload a private key for your certificate")

= render 'lets_encrypt_callout', auto_ssl_available_and_enabled: auto_ssl_available_and_enabled
